<template>
  <div class="container">
    <el-row class="" style="margin-bottom: 20px">
      <el-col :span="16" align="left">
        <el-input
          v-model="searchFrom.param"
          placeholder="指标名称/编号"
          style="width: 150px; margin-right: 15px"
          @change="search"
          clearable
        />
        <el-button class="ordinary" @click="search()">搜索</el-button>
      </el-col>
      <el-col :span="8" align="right" >
        <el-button class="ordinary" @click="getExportBtn()">批量导出</el-button>
          <el-button type="danger" @click="handleDetect()">删除</el-button>
          <el-button class="lock" @click="handleCopy()">复制</el-button>
          <el-button type="primary" @click="handleAdd()">新增指标</el-button>
      </el-col>
    </el-row>
    <div>
      <el-table
        :data="state.table_list"
        style="width: 100%"
        border
        @selection-change="selectionChange"
        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      >
        <el-table-column type="selection" width="55" align="center" :reserve-selection="false" />
        <el-table-column prop="number"  label="指标编号"  align="left" />
        <el-table-column prop="name" align="center" label="指标名称" />
        <el-table-column prop="indexType_text" align="center" label="指标类型" width="80" />
        <el-table-column prop="scoreType_text" align="center" label="计分类型" width="80"> </el-table-column>
        <el-table-column prop="scoreMethod_text" align="center" label="评分方式" width="80"> </el-table-column>
        <el-table-column prop="score" align="center" label="指标分数(H)" width="100" />
        <el-table-column prop="scoreCompose" align="center" label="系统计分组成" width="140">
        </el-table-column>
        <el-table-column prop="indexIntro" align="center" label="指标说明" />
        <el-table-column prop="createUsername" align="center" label="创建人" width="80" />
        <el-table-column prop="address" align="center" label="操作" width="120">
          <template #default="scope">
            <span >
              <el-button type="primary" @click="handleEdit(scope.row)">编辑</el-button>
             
            </span>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        style="margin-top: 20px"
        :total="pageOption.total"
        :page-size="pageOption.size"
        :current-page="pageOption.current"
        @current-change="currentChange"
        layout="total, prev, pager, next, jumper"
        align="right"
      ></el-pagination>
    </div>
    <addAndEdit
      v-model:visible="state.modalVisible"
      @refresh="gettargetlist"
      :opType="state.opType"
     
      :editForm="state.handleRowData"
      
    ></addAndEdit>

  </div>
</template>
    <script lang="ts" setup>
import { ref, reactive } from 'vue'
// import Table from '../../../components/indexTable.vue'
import * as api from '../../../../api/examineManage'
import { ElMessageBox, ElMessage } from 'element-plus'
import addAndEdit from '../../standardIndexLibrary/addAndEdit.vue'
import { useRoute } from 'vue-router'
import { dataDictionary } from '@/api/dict'
interface Cdata {
  [propName: string]: any
}
const searchFrom = reactive({
  //查询
  param: '',
})
// const refreshPage:any=inject('refreshPage', Function, true);
let standardType = ref('1') //该参数决定显示的是中交还是中咨的年度指标列表
const route = useRoute()
const routeQuery = route.query
// let annualId=route.query.id;
const pageOption = reactive({
  total: 0,
  current: 1,
  size: 10,
})
standardType.value = route.meta.type as string
const assignParams = reactive({
 
})
let state = reactive<Cdata>({
  table_list: [],
  modalVisible: false,
  opType: 'add', //add,edit,copy
  handleRowData: null, //正在处理的行数据
  table_loading: false,
})
const dictDatas = reactive({

}) //字典值
let selectedRows = ref<any>([])
const search = () => {
  //搜索
  pageOption.current=1
  gettargetlist()
}

const getExportBtn = () => {
  //批量导出
}
const selectionChange = (arr) => {
  //选中
  selectedRows.value = arr
}
const currentChange = (page) => {
  //翻页
  pageOption.current = page
  gettargetlist();
}
const handleDetect = () => {
  //批量删除

  if (selectedRows.value.length === 0) {
    ElMessage({
      message: '请选择数据后删除！',
      type: 'warning',
    })
  } else if (selectedRows.value.length > 1) {
    ElMessage({
      message: '请选择一条数据！',
      type: 'warning',
    })
  } else {
    ElMessageBox.confirm('确定要删除选中数据吗?', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }).then(() => {
      // let sel_ids=selectedRows.value.map(item=>{return item.id});
      api
        .deleteStandardIndexRequest({
          id: selectedRows.value[0].id,
        })
        .then((res) => {
          if (res.data.code == 200) ElMessage.success('删除成功')
          gettargetlist()
        })
    })
  }
}
const handleAdd = () => {
  //新增
  state.opType = 'add'
  state.modalVisible = true
}
const handleEdit = (item) => {
  //编辑
  state.opType = 'edit'
  state.handleRowData = item
  state.modalVisible = true
}
const handleCopy = () => {
  if (selectedRows.value.length !== 1) {
    ElMessage({
      message: '请选择一条数据复制',
      type: 'warning',
    })
  } else {
    state.opType = 'copy'
    state.handleRowData = selectedRows.value[0]
    state.modalVisible = true
  }
}

const getDictDatas = () => {
  return new Promise((resolve, reject) => {
    state.table_loading = true
    let dictIds = [
      'KHGL_CLASS_INDEX_NAME_CODE',
    ]
    dataDictionary(dictIds).then((res) => {
      let response = res.data.data
      dictDatas.dict_indexTypes = response.KHGL_INDEX_TYPE_CODE

      resolve(1)
    })
  })
}


const gettargetlist = () => {
  //获取table列表
  state.table_loading = true
  api
    .zjIndexlistRequest({
      ...searchFrom,
      annualId: routeQuery.aid, //1-中交标准指标、2-中咨标准指标
    })
    .then((res) => {
      state.table_loading = false
      state.table_list = res.data.data
    })
}

getDictDatas().then(() => {
    gettargetlist()
})
</script>
      <style lang="scss" scoped>
.container {
  background-color: white;
  padding: 20px;
  overflow-y: auto;
  .index-title {
    text-align: center;
    padding-bottom: 10px;
    border-bottom: 1px solid #e7e5e5;
    margin-bottom: 10px;
    font-size: 26px;
  }
}
:deep(.el-dialog__body) {
  padding: 0;
}
:deep(.el-dialog__header) {
  border-bottom: 1px solid #f1eded;
}
</style>
      